
<template>
  <fks-dialog
    width="960px"
    :visible.sync="dialogVisible"
    class="dept"
    @close="close"
  >
    <div slot="title">
      <i
        v-if="title == LANG.ADD || title == LANG.ADD_SUBDEPT"
        class="fks-icon-plus"
      />
      <i
        v-if="title == LANG.EDIT"
        class="fks-icon-edit"
      />
      <i
        v-if="title == LANG.VIEW"
        class="fks-icon-view"
      />
      {{ title }}
    </div>
    <fks-form
      v-if="dialogVisible"
      ref="form"
      :model="formData"
      :rules="rules"
      label-width="90px"
    >
      <fks-form-item
        :span="24"
        prop="name"
        :label="LANG.DEPTNAME"
      >
        <fks-input
          v-model="formData.name"
          maxlength="50"
          show-word-limit
          :readonly="title == LANG.VIEW"
        />
      </fks-form-item>

      <fks-form-item
        lead
        :span="12"
        prop="entName"
        :label="LANG.ENTNAME"
      >
        <fks-input
          v-model="formData.entName"
          maxlength="50"
          show-word-limit
          :readonly="title == LANG.VIEW"
        />
      </fks-form-item>
      <fks-form-item
        :span="12"
        prop="parentName"
        :label="LANG.SUPDEPT"
      >
        <fks-org-selector
          :dept-id.sync="formData.parentNo"
          :dept-name.sync="formData.parentName"
          :readonly="title != LANG.ADD"
          :params="{ portalId: portalId }"
          @change="pOrgChange"
        />
      </fks-form-item>
    </fks-form>
    <div slot="footer">
      <fks-button
        v-if="title != LANG.VIEW"
        type="primary"
        :loading="orgLoading"
        icon="fks-icon-check"
        @click="onSubmit"
      >
        <span style="margin-left: 4px">{{ LANG.SAVE }}</span>
      </fks-button>
    </div>
  </fks-dialog>
</template>
<script>
import * as orgApi from '../api'
import * as types from '@/store/Getter/getterTypes.js'
export default {
  name: 'DeptInfo',
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: ''
    },
    id: {
      type: String,
      default: ''
    },
    dialogType: {
      type: String,
      default: ''
    },
    data: {
      type: Object,
      default() {
        return {
          name: ''
        }
      }
    },
    treeData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      dialogVisible: this.visible,
      formData: {},
      orgLoading: false,
      copyFormData: {}
    }
  },
  computed: {
    rules() {
      return {
        name: [
          {
            required: true,
            message: this.LANG.DEPARTMENT_NAME_REQUIRED,
            trigger: 'blur'
          }
        ],
        entName: [
          {
            required: true,
            message: this.LANG.DEPARTMENT_ENTNAME_REQUIRED,
            trigger: 'blur'
          }
        ],
        sort: [
          {
            required: true,
            message: this.LANG.SORT_ORDER_RULE,
            trigger: 'blur'
          }
        ],
        parentName: [
          {
            required: this.treeData.length === 0 ? false : true,
            message: this.LANG.SUPDEPT_REQUIRED,
            trigger: 'change'
          }
        ]
      }
    },
    type() {
      return this.$store.state.portal.type
    },
    portalId() {
      return this.$store.state.portal.id
    },
    multiPortal() {
      return this.$store.getters[types.MULTI_PORTAL]
    }
  },
  watch: {
    dialogVisible: {
      deep: true,
      handler(val) {
        this.$emit('update:visible', val)
      }
    },
    visible(val) {
      this.dialogVisible = val
    },
    data: {
      deep: true,
      immediate: true,
      handler(val) {
        if (this.title == this.LANG.EDIT) {
          this.formData = val
          this.formData.parentName = val.parentName
          this.$set(this.formData, 'parentNo', val.parentNo.toString())
          return
        }
        if (this.title == this.LANG.ADD_SUBDEPT) {
          this.formData.parentName = val.name
          this.$set(this.formData, 'parentNo', val.orgNo.toString())
          this.$set(this.formData, 'pathName', val.pathName)
          this.$set(this.formData, 'pathNo', val.pathNo)
          return
        }
        if (this.title == this.LANG.VIEW) {
          this.formData = val
          this.formData.parentName = val.parentName
          this.$set(this.formData, 'parentNo', val.parentNo.toString())
          return
        }
      }
    }
  },
  methods: {
    close() {
      this.formData = {}
      this.$emit('update:visible', false)
    },
    onSubmit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.orgLoading = true
          //编辑组织机构
          switch (this.title) {
            case this.LANG.EDIT: {
              this.editOrg()
              break
            }
            case this.LANG.ADD: {
              if (this.formData.pathNo) {
                this.addSubOrg()
                break
              } else {
                this.copyFormData = {}
                this.copyFormData.entName = this.formData.entName
                this.copyFormData.name = this.formData.name
                this.copyFormData.parentName = '根节点'
                this.$set(
                  this.copyFormData,
                  'pathName',
                  `.根节点.${this.formData.name}.`
                )
                this.addOrg()
                break
              }
            }
            case this.LANG.ADD_SUBDEPT: {
              this.addSubOrg()
              break
            }
          }
        }
      })
    },
    //编辑保存
    @monitor('click', '编辑组织机构保存')
    editOrg() {
      let params = Object.assign(
        this.formData,
        { portalId: this.portalId },
        { type: this.type }
      )
      orgApi
        .modifyOrg(params)
        .then((res) => {
          this.orgLoading = false
          if (res.status) {
            this.$message.success(this.LANG.EDIT_SUCCESS)
            this.$emit('refresh')
            this.close()
          }
        })
        .catch(() => {
          this.orgLoading = false
        })
      return params
    },
    //新增保存
    @monitor('click', '新增组织机构保存')
    addOrg() {
      let params = Object.assign(
        this.copyFormData,
        { portalId: this.portalId },
        { type: this.type }
      )
      orgApi
        .addOrg(params)
        .then((res) => {
          this.orgLoading = false
          if (res.status) {
            this.$message.success(this.LANG.ADD_SUCCESS)
            this.$emit('refresh')
            this.close()
          }
        })
        .catch(() => {
          this.orgLoading = false
        })
      return params
    },
    //新增子部门保存
    addSubOrg() {
      this.copyFormData = {}
      this.copyFormData.parentName = this.formData.parentName
      this.copyFormData.parentNo = this.formData.parentNo
      this.copyFormData.entName = this.formData.entName
      this.copyFormData.name = this.formData.name
      this.$set(
        this.copyFormData,
        'pathName',
        `${this.formData.pathName}${this.formData.name}.`
      )
      this.$set(this.copyFormData, 'pathNo', `${this.formData.pathNo}`)
      this.addOrg()
    },
    /**
     * @description: 选择部门切换时处理数据
     */
    pOrgChange(data) {
      if (data[0]) {
        this.formData.pathNo = data[0].content.pathNo
        this.formData.pathName = data[0].content.pathName
      } else {
        this.formData.pathNo = ''
      }
    }
  }
}
</script>
<style lang="scss" scoped>
::v-deep .fks-dialog__body {
  padding-bottom: 0;
}
</style>